<template>
	<view class="login">
		<view class="logo_box">
			<image class="logo" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-baf89db3-4d55-4b1f-a05e-c0a1170f8dce/3fce4d76-af43-4138-b04d-caa6b911a9f8.png"></image>
		</view>
		<view class="form_list">
			<yt-input-user placeholder="请输入用户名" v-model="username"></yt-input-user>
			<yt-input-pass placeholder="请输入密码" v-model="password"></yt-input-pass>
		</view>
		
		<view class="button_type">
			<view style="display: inline-block" @click="rempass">
				<u-icon :name="name" size="40rpx" :color="color"></u-icon>
				<text class="left">记住密码</text>
			</view>
			<text class="right">忘记密码？</text>
		</view>
		<view class="button_login">
			<yt-button-login  @login="login"></yt-button-login>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import ytInputUser from "../../comment/yt-input-user.vue"
	import ytInputPass from "../../comment/yt-input-pass.vue"
	import ytButtonLogin from "../../comment/yt-button-login.vue"
	import { mapMutations } from 'vuex'
	export default {
		data() {
			return {
				color:'#000',
				name:'checkmark-circle',
				isRempass:false,
				username:'',
				password:''
			};
		},
		onLoad() {
			// this.$request({
			// 	actions:123
			// })后期优化代码准备
			var a = [1,2,3]
			// if(a){
			// 	console.log(true)
			// }else{
			// 	console.log(false)
			// }
			console.log(typeof a == 'object')
			
			
			uni.showLoading({
				mask:true,
				title:'登录中。。。'
			})
			uniCloud.callFunction({
				name: 'uni-id-cf_mobile',
				data: {
					action:"autoLogin",
					params:{
						user_id:uni.getStorageSync('user_id')
					}
				}
			}).then(({result}) => {
				let {toPage,userInfo} = result
				if(result.code){
					if(uni.getStorageSync('isLogined')){
						uni.hideLoading()
						this.$refs.uToast.show({
							title: 'token已过期，请登录！',
							type: 'error',
							position:"top"
						})
						this.username = uni.getStorageSync('lastUsername')
						if(uni.getStorageSync('isRempass')){
							this.password = uni.getStorageSync('password')
						}
					}
					uni.hideLoading()
				}else{
					uni.setStorageSync('lastUsername',userInfo.data[0].username)
					uni.setStorageSync('userRole',userInfo.data[0].role)
					uni.switchTab({
						url:toPage,
						fail(e) {
							console.log(e)
						}
					})
					uni.switchTab({
						url:'../index/index'
					})
					uni.hideLoading()
				}
				console.log(result)
			}).catch(err => {
				console.log(err)
			})
		},
		methods:{
			...mapMutations({
				setToken(commit, tokenInfo) {
					commit('user/SET_TOKEN', tokenInfo)
				}
			}),
			rempass(){
				this.isRempass = !this.isRempass
				if(this.isRempass){
					this.color = "#BB0000FF",
					this.name = 'checkmark-circle-fill'
					
				}else{
					this.color = "#000",
					this.name = 'checkmark-circle'
				}
			},
			login(){
				uni.showLoading({
					mask:true,
					title:'登录中。。。'
				})
				var Vue = this
				var params = {
					username:Vue.username,
					password:Vue.password
				}
				uniCloud.callFunction({
					name: 'uni-id-cf_mobile',
					data: {
						action:"login",
						params
					}
				}).then(({result}) => {
					if(result.code != 0){
						uni.hideLoading()
						this.$refs.uToast.show({
							title: result.errMsg,
							type: 'error',
							position:"top"
						})	
					}else{	
						uni.hideLoading()
						var Vue = this
						var { role,_id } = result.userInfo
						uni.setStorage({
							key: "lastUsername",
							data:result.username
						})
						uni.setStorage({
							key:'userRole',
							data:role
						})
						uni.setStorage({
							key:"user_id",
							data:_id
						})
						uni.setStorageSync('isLogined',true)
						uni.setStorageSync('isRempass',Vue.isRempass)
						this.setToken({
							token: result.token,
							tokenExpired: result.tokenExpired
						})
						if(this.isRempass){
							uni.setStorageSync('password',Vue.password)
						}else{
							uni.removeStorageSync('password')
						}
						uniCloud.callFunction({
							name: 'uni-id-cf_mobile',
							data: {
								action:"getUserRole",
								params:{
									userRole:uni.getStorageSync('userRole')[0]
								}
							}
						}).then(({result}) => {
							uni.setStorageSync('role',result.data[0])
							console.log(result)
						}).catch(err => {
							console.log(err)
						})
						uni.switchTab({
							url:'../index/index'
						})
					}
					console.log(result)
				}).catch(err => {
					uni.hideLoading()
					console.log(err)
				})
			}
		},
		components:{
			ytInputUser,
			ytInputPass,
			ytButtonLogin
		}
	}
</script>

<style lang="scss">
.logo_box{
	margin: 100rpx auto;
	.logo{
		width: 450rpx;
		height: 200rpx;
		margin: 0rpx auto;
		display: block;
	}
}
.button_type{
	margin: 0 auto;
	width: 500rpx;
	.check{
		display: inline-block;
		margin-left: 26.7rpx;
	}
	.left{
		margin-left: 10.68rpx;
		
	}
	.right{
		float: right;
	}
}
.button_login{
	margin-top: 80rpx;
}
</style>
